<template>
  <div>
    <x-table :cell-bordered="false" :content-bordered="false" style="background-color:#fff;">
      <thead>
      <tr style="background-color: #F7F7F7">
        <th>发送对象</th>
        <th>状态</th>
      </tr>
      </thead>
      <tbody>
      <tr v-for="(value,index) in getSendToUserList">
        <td>{{value.wxName}}</td>
        <td>未发送</td>
      </tr>
      </tbody>
    </x-table>
    <group title="">
      <x-button type="primary" @click.native="addSendToUserPopup">添加</x-button>
    </group>
    <div v-transfer-dom>
      <x-dialog v-model="showDialogStyle" hide-on-blur :dialog-style="{'max-width': '100%', width: '100%', height: '50%', 'background-color': 'transparent'}">
<!--        <div style="color:#fff;text-align:center;" @click="showDialogStyle = false">
          234
        </div>-->
        <group title="增加发送对象">
          <selector placeholder="请选择" v-model="user" :options="friendList"></selector>
          <x-button type="primary" @click.native="addSendUser">添加</x-button>
        </group>
      </x-dialog>
    </div>
  </div>
</template>
<script>
  import { XTable, Selector, Group, XButton, XDialog, TransferDomDirective as TransferDom } from 'vux'
  import {mapGetters, mapActions} from 'vuex'

  export default {
    directives: {
      TransferDom
    },
    components: {
      XTable,
      Selector,
      Group,
      XButton,
      XDialog
    },
    created: function () {
    },
    computed: mapGetters([
      'getSendToUserList'
    ]),
    methods: {
      ...mapActions(['addSendUserList']),
      addSendToUserPopup () {
        this.$http.get('/wx/WxRobotController.do?getWxRobotContactInfo&uuid=' + localStorage.uuid)
          .then(function (res) {
            console.log(res.body.result)
            let l = res.body.result
            let userList = []
            l.forEach((value, index, array) => {
              let remarkName = value.remarkName
              if (remarkName !== '') {
                remarkName = '(' + remarkName + ')'
              }
              userList.push(value.nickName + remarkName)
            })
            this.friendList = userList
            this.showDialogStyle = true
          })
      },
      addSendUser () {
        this.addSendUserList({wxName: this.user})
      }
    },
    data () {
      return {
        user: String,
        friendList: [],
        showDialogStyle: false
      }
    }
  }
</script>

<style lang="less" scoped>
  @import '~vux/src/styles/close';
  .dialog-demo {
  .weui-dialog{
    border-radius: 8px;
    padding-bottom: 8px;
  }
  .dialog-title {
    line-height: 30px;
    color: #666;
  }
  .img-box {
    height: 350px;
    overflow: hidden;
  }
  .vux-close {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  }
</style>
